// Loading组件是在没有token的时候出现

import React from 'react';
import Backdrop from '@material-ui/core/Backdrop';
import CircularProgress from '@material-ui/core/CircularProgress';
import { makeStyles } from '@material-ui/core/styles';
import { connect } from 'react-redux'

const useStyles = makeStyles((theme) => ({
  backdrop: {
    zIndex: theme.zIndex.drawer + 1,
    color: '#fff',
  },
}));

function Loading(props) {
  const classes = useStyles();
  // const [open, setOpen] = React.useState(false);
  const handleClose = () => {
    // setOpen(false);
  };

  return (
    <div>
      <Backdrop className={classes.backdrop} open={props.showLoading} onClick={handleClose}>
        <CircularProgress color="inherit" />
      </Backdrop>
    </div>
  );
}

// 状态映射
const mapStateToProps = (state) => {
  return {
    showLoading: state.showLoading
  }
}
// 事件派发映射

const mapDispatchToprops = (dispatch) => {
  return {
    closeLoadingFn() {
      dispatch({ type: "closeLoading" })
    }
  }
}
export default connect(mapStateToProps, mapDispatchToprops)(Loading)
